<template>
  <div id="stock-warning">
    <div class="stock-warning-title">库存预警</div>
    <dv-scroll-board :config="config" style="width: 100%;height: 80%;"/>
  </div>
</template>

<script>
export default {
  name: 'StockWarning',
  data() {
    return {
      config: {}
    //   config: {
    //     header: ['库存地', '耗材', '库存'],
    //     data: [
    //       ['儿科二病区', '口垫', '5'],
    //       ['内科门诊', '一次性使用精密输液器带针', '13'],
    //       ['内科门诊', '胃造口螺旋形空肠管', '6'],
    //       ['设备科', '胃造口螺旋形空肠管', '2'],
    //       ['设备科', '高压氧舱吸氧面罩', '1'],
    //       ['设备科', '曼吉磁贴', '3'],
    //       ['中心库房', '输液吊杆', '4'],
    //       ['中心库房', '经皮气管切开导入器', '2']
    //     ],
    //     index: true,
    //     columnWidth: [50],
    //     align: 'center',
    //     rowNum: 4,
    //     //表头背景色
    //     headerBGC: '#1981f6',
    //     headerHeight: 40,
    //     //奇数行背景色
    //     oddRowBGC: 'rgba(0, 44, 81, 0.8)',
    //     //偶数行背景色
    //     evenRowBGC: 'rgba(10, 29, 50, 0.8)'
    //   }
    }
  },
  methods: {
    async createData() {
      let stockWarning = []
      await this.$ajax.get('/wm/stock/get_stock_warning').then(resp => {
        if (resp.code != 0) {
          global.utilMessage.alertFail(`获取库存预警数据发生错误：${resp.msg}`)
          return
        }
        if (resp.data.length > 0) {
          resp.data.forEach((item, index) => {
            let stock = []
            stock.push(item.warehouseName)
            stock.push(item.matrName)
            stock.push(item.skuQty)
            if (item.skuQtyDaily == 0) {
              item.skuQtyDaily = item.skuQty
            }
            stock.push(Math.floor(item.skuQty / item.skuQtyDaily))
            stockWarning.push(stock)
          })
        }
      })
      this.config = {
        header: ['库存地', '耗材', '库存', '可用天数'],
        data: stockWarning,
        index: true,
        columnWidth: [60, 200, 300, 100, 100],
        align: 'center',
        rowNum: 5,
        //表头背景色
        headerBGC: '#1981f6',
        headerHeight: 40,
        //奇数行背景色
        oddRowBGC: 'rgba(0, 44, 81, 0.8)',
        //偶数行背景色
        evenRowBGC: 'rgba(10, 29, 50, 0.8)'
      }
    }
  },
  mounted() {
    const { createData } = this

    createData()

    setInterval(createData, 1800000)
  }
}
</script>

<style lang="scss">
  #stock-warning {
    width: 100%;
    height: 30%;
    margin-bottom: 10px;
    background-color: rgba(6, 30, 93, 0.5);
    border-top: 2px solid rgba(1, 153, 209, .5);
    box-sizing: border-box;

    .stock-warning-title {
      height: 20%;
      font-weight: bold;
      text-indent: 20px;
      font-size: 20px;
      display: flex;
      align-items: center;
    }
  }
</style>
